<div class="panel-comtrade">
  <!-- <TLoading :tloading="tv.tpanelTrade.tloading" /> -->
  <div class="hd">{{ "i18n.trade.head" | translate: lang }}</div>
  <div class="bd df jcsb">
    <div class="i">{{ "i18n.trade.time" | translate: lang }}</div>
    <!-- <div class="i">{{ "i18n.trade.type" | translate: lang }}</div> -->
    <div class="i">
      {{ "i18n.trade.price" | translate: lang }}({{ onSymbol.mu }})
    </div>
    <div class="i">{{ "i18n.trade.amount" | translate: lang }}</div>
  </div>
  <div class="ft" data-scrollbar style="overflow-y: scroll;">
    <div>
      <div
        matRipple
        class="r df jcsb"
        *ngFor="let item of tradeLists; let i = index"
      >
        <div class="i t-justify">
          {{ item.time | l10nDate: defaultLocale:"mediumTime" }}
        </div>
        <!--
          <div
            class="i"
            [ngClass]="{ buy: item.type == 'BUY', sell: item.type == 'SELL' }"
            l10nTranslate
          >
            {{ item.type === "BUY" ? "i18n.exchange.buy" : "i18n.exchange.sell" }}
          </div>
        -->
        <div
          class="i"
          [ngClass]="{ buy: item.type == 'BUY', sell: item.type == 'SELL' }"
        >
          {{ item.price }}
        </div>
        <div class="i">{{ item.amount }}</div>
      </div>
    </div>
  </div>
</div>
